import {PureComponent,Fragment} from "react"
import {InputItem} from "antd-mobile"
import {isNull} from "../../utils/helper"
export default class MiTextTel extends PureComponent {
	constructor(props){
		super(props);
		this.state = {}
	}
	
	render(){
		let {field,formData,label,align="left",label_width=5,tel_field,tips,label_text_color,label_text_align="left"}=this.props;
		let labelClass="am-input-label am-input-label-"+label_width;
		let href;
		if(!isNull(tel_field)){
			let tel = formData[tel_field];
			if(!isNull(tel)){
				href="tel:"+tel
			}
		}
		return (
		<div>
			<div className="am-list-item mi-text">
				<div className="am-list-line">
					<div className={labelClass} style={{textAlign:label_text_align,color:label_text_color}}>
						<span className="am-form-label">{label}</span>
					</div>
					<div className="am-input-control" style={{textAlign:align}}>{formData[field[0]]}
						{
							href&&<a href={href} style={{color:"unset"}}>{tel}
								<img style={{width:"18px",height:"18px",marginLeft:"5px"}} src="image/dianhua.svg" alt="" />
							</a>
						}
					</div>
				</div>
			</div>
			{tips&&<p className="tipsStyle">{tips}</p>}
		</div>
		)
	}
}